import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:syn_4s/core/extension/build_context_extension.dart';
import 'package:syn_4s/core/extension/int_extension.dart';
import 'package:syn_4s/core/router/router.dart';
import 'package:syn_4s/core/services/login_request.dart';

import '../../../core/services/config.dart';
import '../../../core/utils/dialog_utils.dart';
import '../../../core/utils/toast_utils.dart';
import '../../../core/viewmodel/forgot_pw_view_model.dart';
import '../../../generated/l10n.dart';
import '../../shared/app_theme.dart';
import '../../widgets/custom_ui.dart';
import '../../widgets/gradient_button.dart';

class ForgotPwContent extends StatelessWidget {
  ForgotPwViewModel vm = Get.find<ForgotPwViewModel>();

  ForgotPwContent({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        height: double.infinity,
        decoration: const BoxDecoration(
            gradient: LinearGradient(
                colors: [Color(0xff0C558A), Color(0xff07233D)],
                begin: Alignment.centerLeft,
                end: Alignment.centerRight)),
        padding: EdgeInsets.only(left: 12.px, right: 12.px, top: 38.px),
        child: SingleChildScrollView(
            child: Column(
              children: buildColumnChildren(context),
            )),
      ),
    );
  }

  List<Widget> buildColumnChildren(BuildContext context) {
    return [
      buildBack(context),
      SizedBox(
        height: 45.px,
      ),
      Image.asset(
        "assets/images/logo.png",
        width: 260.px,
        height: 40.px,
      ),
      SizedBox(
        height: 6.px,
      ),
      Text(
        "Smart Site Safety System (4S)",
        style: TextStyle(
            fontSize: 22.px, color: Colors.white, fontFamily: 'Oswald'),
      ),
      SizedBox(
        height: 32.px,
      ),
      Container(
        padding: EdgeInsets.only(left: 12.px, right: 12.px, top: 24.px),
        decoration: BoxDecoration(
            color: AppTheme.loginContentColor,
            shape: BoxShape.rectangle,
            border: Border.all(color: AppTheme.orangeColor),
            boxShadow: [
              BoxShadow(color: AppTheme.orangeColor, blurRadius: 8.px)
            ]),
        child: Column(
          children: [
            Container(
                padding: EdgeInsets.symmetric(horizontal: 10.px),
                child: Text(
                  context.l10n.forgot_title,
                  textAlign: TextAlign.center,
                  style: const TextStyle(height: 1.0, color: AppTheme.loginTextColor),
                )),
            SizedBox(
              height: 24.px,
            ),
            buildTextField(S.of(context).email_hint, "assets/images/email.png",
                vm.emailController,
                contentPadding:
                EdgeInsets.symmetric(vertical: 12.px, horizontal: 10.px)),
            SizedBox(
              height: 16.px,
            ),
            buildCodeTextField(context),
            buildButton(context),
          ],
        ),
      ),
    ];
  }

  Widget buildTextField(
      String hintText, String prefixIcon, TextEditingController controller,
      {EdgeInsetsGeometry? contentPadding, int? maxLength}) {
    return TextField(
      controller: controller,
      maxLength: maxLength,
      style: TextStyle(fontSize: 20.px),
      decoration: InputDecoration(
          counterText: "",
          contentPadding: contentPadding,
          filled: true,
          fillColor: Colors.white,
          hintText: hintText,
          enabledBorder: getWhiteOvalBorder(),
          focusedBorder: getFocusedBorder(),
          prefixIcon: ImageIcon(
            AssetImage(prefixIcon),
            color: AppTheme.orangeColor,
          )),
    );
  }

  Widget buildCodeTextField(BuildContext context) {
    return Stack(
      alignment: Alignment.centerRight,
      children: [
        buildTextField(context.l10n.code_hint, "assets/images/shield.png",
            vm.codeController,
            maxLength: 6,
            contentPadding: EdgeInsets.only(
                top: 12.px, bottom: 12.px, left: 10.px, right: 108.px)),
        Positioned(
          right: 16.px,
          child: InkWell(
            onTap: () {
              if (vm.emailController.text.isEmpty) {
                ToastUtils.showToast(context.l10n.p_email_hint);
                return;
              }
            },
            child: Text(
              context.l10n.get_code,
              style: const TextStyle(color: AppTheme.orangeColor),
            ),
          ),
        )
      ],
    );
  }

  Widget buildButton(BuildContext context) {
    return GradientButton(
        margin: EdgeInsets.only(top: 32.px, bottom: 20.px),
        onPressed: () {
          confirm(context);
        },
        child: Text(
          S.of(context).confirm,
          style: TextStyle(color: Colors.white, fontSize: 20.px),
        ));
  }

  Widget buildBack(BuildContext context) {
    return GestureDetector(
      onTap: () {
        Get.back();
      },
      child: Row(crossAxisAlignment: CrossAxisAlignment.center, children: [
        Icon(
          Icons.chevron_left,
          color: Colors.white,
          size: 32.px,
        ),
        Text(context.l10n.back_login,
            style: TextStyle(color: Colors.white, fontSize: 20.px))
      ]),
    );
  }

  void confirm(BuildContext context) {
    if (vm.emailController.text.isEmpty) {
      ToastUtils.showToast(S.of(context).p_email_hint);
      return;
    }
    if (vm.codeController.text.isEmpty) {
      ToastUtils.showToast(S.of(context).p_code_hint);
      return;
    }
    FocusScope.of(context).requestFocus(FocusNode());
    Get.toNamed(MyRouter.resetPwRoute);
    // DialogUtils.loading(context);
    // LoginRequest.forgotPw(vm.emailController.text).then((value) {
    //   DialogUtils.closeDialog(context);
    //   ToastUtils.showToast(value.message ?? "");
    //   if (value.status == HttpConfig.success) {
    //     Get.toNamed(MyRouter.resetPwRoute);
    //   }
    // }).catchError((value) {
    //   DialogUtils.closeDialog(context);
    //   ToastUtils.showToast(context.l10n.network_error);
    // });
  }
}